<!-- 出入口弹窗 -->

<template>
  <WebModal path="entrance" word="出入口" edit="设置" :onSubmit="isEdit ? toSave : null">
    <WebForm path="entrance">
      <ModalVideo class="quar" :one="one" :video="videoDevice" :visible="visible" @bind="bindVideo" />
      <MyDetail class="quar3" />
    </WebForm>
  </WebModal>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import FooterEdit from '@admin/views/System/IOT/IOTList/MyModal/FooterEdit'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'EntranceModal',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixWeb('entrance')],

  /**
   * 组件导入 (Abc.vue + Abc/index.vue)
   */
  ...CORE.components(require.context('../../components', true, /vue$/), require.context('./', true, /vue$/)),

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 视频设备
     */
    videoDevice() {
      const { videoDevice } = this.one
      if (CORE.isEmpty(videoDevice)) return null

      const { deviceId: id, deviceName } = videoDevice[0]
      return { id, deviceName }
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    ...FooterEdit.methods,

    /**
     * 绑定视频
     */
    bindVideo(video) {
      this.one.videoDevice = video ? [video] : []
    },
  },
}
</script>
